<template>
  <div style="float: left;margin-top: 5px">
    <el-form ref="fileSearchRef" :model="searchFormData">
      <el-form-item label="关键词" >
        <el-input  type="text" v-model="searchFormData.fileName"></el-input>
      </el-form-item>
    </el-form>
  </div>
  <div style="height: 40px;margin-top: 5px;float: left;margin-left: 20px;">
    <el-button @click="searchClick">查询</el-button>
  </div>
  <div style="clear: both"></div>
  <div style="height: calc(100% - 60px);">
    <Table  :show-page="true" ref="tableRef" :show-line-number="true"
            :showCheckBox="false" :url="fileUrl" :columns="columns">
    </Table>
  </div>
</template>

<script setup>

import Table from "@/components/plugs/table/Table.vue";
import {reactive, ref, toRaw} from "vue";

const tableRef = ref(null);
const fileSearchRef = ref(null);
const fileUrl = ref("/file/getFilePage");
const columns = [
  {field:"fileName","desc": "文件名称"},
  {field:"uuidFileName","desc": "名称"},
  {field:"filePath","desc": "文件地址"},
  {field:"fileSize","desc": "文件大小"},
  {field:"fileLongSize","desc": "文件大小"},
  {field:"fileSuffix","desc": "后缀"},
  {field:"showTime","desc": "创建时间"}
];
const searchFormData = reactive({
  "fileName": ""
});

const searchClick = () =>{
  tableRef.value.reload(toRaw(searchFormData));
}

</script>

<style scoped>

</style>